﻿<!DOCTYPE html>
<html>
<head>
    <title>酷居科技抽奖活动</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link href="../library/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <link href="../css/scratch.css" rel="stylesheet" />

    <script src="../javascript/library/jquery-1.11.3.min.js"></script>
    <script src="../library/bootstrap/js/bootstrap.min.js"></script>
    <script src="../library/avalon/avalon.js"></script>

    <script>
        avalon.ready(function () {
            var model = avalon.define("test", function (vm) {
                vm.json = "";
            });

            $.getJSON("../controller/scrathex.ashx", { "action": "getprizesettingorderby"}, function (json) {
                model.json = json;
                avalon.scan();
            }, "json");

        });
     
    </script>
</head>
<body ms-controller="test">
    <div class="row">
        <div id="dvtitle" class="col-sm-12"></div>
    </div>
    <div class="row" style="    height: 190px;">
        <div id="dvscratch" class="col-sm-12" style="position:relative">
            <div class="row" style="height:30px"></div>
            <h2 style="margin-left:20px;color:#c52724;font-family:'Microsoft YaHei UI';margin-bottom: 0px;">酷居刮刮区</h2>
            <h4 style="margin-left:20px;font-family:'Microsoft YaHei UI';color:#7a7a78">大奖等你刮出来</h4>
            <h3 style="margin-left:20px;font-family:'Microsoft YaHei UI';color:#7a7a78;padding-top: 10px;">刮奖区</h3>
            <canvas id="cvscratch" class="row" width="140" height="50"></canvas>
        </div>
    </div>
    <div class="row">
        <div id="dvawardtitle">奖项说明</div>
    </div>
    <div class="row">
        <div class="col-sm-12" style="margin-top:10px; padding:0px;">
            <ul class="list-group">
                <li class=" groupitem h5" ms-repeat="json.Awards">
                    <div class="row">
                        <div class="col-xs-8">{{el.Description}}</div>
                        <div class="col-xs-4">{{el.Price}}</div>
                    </div>
                </li>
            </ul>
        </div>
    </div>

    <div class="row">
        <div id="dvawardtitle">活动说明</div>
    </div>
    <div class="row">
        <div class="col-sm-12" style="margin-top:10px;">
            <ul class="list-group">
                <li class=" groupitem h5" ms-repeat="json.Introductions">
                    <div class="row">{{el}}</div>
                </li>
            </ul>
        </div>
    </div>
    <div class="row">
        <div id="interpretation" class=" col-xs-offset-7 groupitem h7">
            {{json.Interpretation }}
        </div>
    </div>

    <script src="../javascript/scratchex.js"></script>
</body>
</html>
